<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="/Resources/css/public.css">
    <link rel="stylesheet" href="/Resources/css/login.css">
</head>

<body>
    <!---------------- 头部 ---------------->
    <div class="head">
        <div class="logo">
            <a href="javascript:;">
                <img src="/Resources/images/logo.png" alt="">
               
            </a>
            <span class='logo-text'>
                    登录
                </span>
        </div>
    </div>
    <!---------------- 主要区域 ---------------->
    <div class="login-wrap">
        <div class="login">
            <div class="login-section" style='margin-bottom: 10px;'>
                <div class="input-title input-text1">
                    用户名：
                </div>
                <div class="input-text">
                    <input type="value" class="borderinput">
                </div>
            </div>
            <div class="login-error red">
                用户名或密码不正确
            </div>
            <div class="login-section"  style='margin-top: 10px;'>
                <div class="input-title input-text1">
                    密码：
                </div>
                <div class="input-text">
                    <input type="password" class="borderinput">
                </div>
            </div>
            <div class="login-action login-action-checkbox">
                <div class="login-section">
                    <p class='login-action-protocol'>
                        <span class="protocol-checkbox">
                    <i class="icon icon-checkbox"></i>
                    
                </span>记住密码
                    </p>
                    <a href="javascript:;" class='forget linkshover'>
                    忘记密码？
                </a>
                </div>
                <div class="login-section">
                    <a href="index.html" class='bt bt-blue bt-login'>
                        登录
                    </a>
                    <p class='hasnoaccount'>
                        没有账号？
                        <a href="register.html">
                            立即注册
                        </a>
                    </p>
                </div>
            </div>
        </div>
        <div class="register-bottom">
            <a href="javascript:;">
            关于我们
        </a>
            <a href="javascript:;" class='mar0'>
            法律声明
        </a>
        </div>
    </div>
    <!----------------------------重置密码弹窗  ---------------------------->
    <div class="layer-reseting none">
        <div class="layer-title">
            找回密码
            <i class='icon icon-close'></i>
        </div>
        <div class="reseting-content">
            <div class="reseting-section">
                <div class="input-title input-text1">
                    <span class="must">
                            *
                    </span>手机号码：
                </div>
                <div class="input-text">
                    <input type="value" class="borderinput">
                </div>
            </div>
            <div class="reseting-section">
                <div class="input-title input-text1">
                    <span class="must">
                            *
                    </span>新密码：
                </div>
                <div class="input-text">
                    <input type="password" class="borderinput">
                </div>
            </div>
            <div class="reseting-section">
                <div class="input-title input-text1">
                    <span class="must">
                            *
                    </span>确认密码：
                </div>
                <div class="input-text">
                    <input type="password" class="borderinput">
                </div>
            </div>
            <div class="reseting-section reseting-section-yzm">
                <div class="input-title input-text1">
                    <span class="must">
                            *
                    </span>短信验证码：
                </div>
                <div class="input-text">
                    <input type="value" class="borderinput" placeholder="">
                    <a href="javascript:;" class="bt bt-blue bt-yzm bt-reseting-yzm">
                               发送验证码
                           </a>
                </div>
            </div>
            <div class="reseting-section reseting-section-sure">
                <div class="input-title">
                    &nbsp;
                </div>
                <div class="input-text input-text1">
                    <a href="javascript:;" class="bt bt-gray bt-reset">
                               重置密码
                           </a>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="/Resources/js/jquery.min.js"></script>
<script src="/Resources/layer/layer.min.js"></script>
<script src="/Resources/js/public.js"></script>
<script>
// 重置密码
$(document).on('click', '.forget', function() {
    layer.open({
        type: 1 //Page层类型
            ,
        area: ['480px', '400px'],
        title: '',
        // offset: '176px',
        closeBtn: 0, //不显示关闭按钮

        // btn: ['重要','奇葩'],
        shade: 0.6 //遮罩透明度
            ,
        maxmin: false //允许全屏最小化
            ,
        anim: 1 //0-6的动画形式，-1不开启
            ,
        content: $('.layer-reseting')
    });
})
$(document).on('click', '.layer-reseting .bt-reset', function() {
    layer.closeAll();
})

// 记住密码
$(document).on('click', '.protocol-checkbox', function() {
    $(this).toggleClass('active')
})

// 验证码
var fn_yzm=function(sign, aim) {
    var sign = 1;
    $(document).on('click', aim, function() {
        if (sign == 1) {
            sign = 0;
            var num = 30;
            var that = $(this)
            $(this).css('background', '#c8cbcf')
            $(this).html('重新获取（' + num + '）S')
            var timer = setInterval(function() {
                num--;
                if (num == 0) {
                    sign = 1;
                    clearInterval(timer);
                    that.css('background', '#6aa1e6')
                    that.html('获取验证码')
                } else {
                    sign = 0
                    that.css('background', '#c8cbcf')
                    that.html('重新获取（' + num + '）S')
                }
            }, 1000)

        }
    })
}
fn_yzm('flag_reseting','.bt-reseting-yzm')
</script>

</html>